import React, { Component } from 'react'
import { Select, SelectItem } from './index'

class TransitionDemo extends Component {
  constructor (props) {
    super(props)
    this.state = {
      value: 'D'
    }
  }
  render () {
    return (
      <div style={{height: '1000px'}}>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
        <div>{this.state.value}</div>
        <Select value={this.state.value} onChange={val => this.setState({ value: val })}>
          <SelectItem value="A" label="aaaaaaaaaaaaa"></SelectItem>
          <SelectItem value="B" label="bbbbbbbb"></SelectItem>
          <SelectItem value="C" label="cccccccccc"></SelectItem>
          <SelectItem value="D" label="ddddddddddd"></SelectItem>
        </Select>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
        <p>aaa</p>
      </div>
    )
  }
}

export default TransitionDemo